<template>
    <div class="additionalLoan">
        <Form ref="additionalLoanForm" :model="additionalLoanForm"  :label-width="120">
            <div style="padding-left: 0px;"> 
                 <Row>
                    <Col>
                        <common-finance
                        :financeForm="additionalLoanForm"
                     ></common-finance>
                    </Col> 
                </Row>
                <div >
                    <Row>
                        <Col>
                            <FormItem label="贷款期限"> 
                                <div class="inline-block" v-if="additionalLoanForm.newValue.loanLimit"> 
                                    <Input v-model="additionalLoanForm.newValue.loanLimit" style="width:60px" placeholder="" :readonly="readonly"/>
                                    <span  class="commonSpan">期</span>
                                </div>
                                <div class="oldValue">
                                    <span>{{additionalLoanForm.oldValue.loanLimit}}</span><b style="font-weight: normal;">期</b>
                                </div> 
                            </FormItem> 
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="首付"> 
                                <div  class="inline-block" v-if="additionalLoanForm.newValue.downPayScale">
                                    <Input v-model="additionalLoanForm.newValue.downPayScale" style="width:60px" placeholder="" :readonly="readonly"/>
                                    <span class="commonSpan">%</span>
                                </div>
                                <div class="oldValue">
                                    <span>{{additionalLoanForm.oldValue.downPayScale}}</span><b style="font-weight: normal;">%</b>
                                </div> 
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="" :label-width="20"> 
                                <div  class="inline-block" v-if="additionalLoanForm.newValue.downPayAmt"> 
                                    <Input v-model="additionalLoanForm.newValue.downPayAmt" style="width: 120px;" placeholder="" :readonly="readonly"/>
                                    <span class="commonSpan">元</span>
                                </div>
                                <div class="oldValue">
                                    <span>{{additionalLoanForm.oldValue.downPayAmt}}</span><b style="font-weight: normal;">元</b>
                                </div>
                            </FormItem> 
                        </Col>
                    </Row>
                    <Row v-if="isTail">
                        <Col span="12">
                            <FormItem label="尾款" >
                                <div class="inline-block" v-if="additionalLoanForm.newValue.tailPayScale">
                                    <Input v-model="additionalLoanForm.newValue.tailPayScale" style="width:60px" placeholder="" :readonly="readonly"/>
                                    <span class="commonSpan">%</span>
                                </div>
                                <div class="oldValue">
                                    <span>{{additionalLoanForm.oldValue.tailPayScale}}</span><b style="font-weight: normal;">%</b>
                                </div> 
                            </FormItem> 
                        </Col>
                        <Col span="12">
                            <FormItem label="" :label-width="20"> 
                                <div  class="inline-block" v-if="additionalLoanForm.newValue.tailPayAmt">
                                    <Input v-model="additionalLoanForm.newValue.tailPayAmt" style="width: 120px;" placeholder="" :readonly="readonly"/>
                                    <span class="commonSpan">元</span>
                                </div>
                                <div class="oldValue">
                                    <span>{{additionalLoanForm.oldValue.tailPayAmt}}</span><b style="font-weight: normal;">元</b>
                                </div>
                            </FormItem> 
                        </Col>
                    </Row>
                    <Row>
                        <Col>
                            <FormItem label="贷款金额(元)"> 
                                <div  class="inline-block" v-if="additionalLoanForm.newValue.loanAmt">
                                    <Input v-model="additionalLoanForm.newValue.loanAmt" placeholder="" class="w200" :readonly="readonly"/>
                                    <span class="commonSpan">元</span>
                                </div>
                                <div class="oldValue">
                                    <span>{{additionalLoanForm.oldValue.loanAmt}}</span><b style="font-weight: normal;">元</b>
                                </div>
                            </FormItem> 
                        </Col>
                    </Row>
                </div>
            </div>
        </Form>
    </div>
</template>
<script>
import {prodRes1} from "@/projects/afs-apply/assets/js/staticData.js"
import {deepClone} from "@/libs/utils/ObjectClone";
import CommonFinance from "../common-finance/common-finance"
export default {
    name:"additionalLoan",
    data(){
        return{
           readonly:true,
           isTail:0,
           additionalLoanForm:{
                //项目融资列表
                additionalAmtList:[
                ],
                newValue:{
                },
                oldValue:{
                },
            },
        }
    },
    computed:{
       
    },
    components:{
        CommonFinance,
    },
    props:{
        addCostDetails:{
            type:Object
        }
    },
    watch:{
        addCostDetails(val){
            if(Object.keys(val).length>0){
                this.isTail=eval(val.isTail);
                let {newAddValue,oldAddValue}=val;
                this.additionalLoanForm.newValue=newAddValue;
                this.additionalLoanForm.oldValue=oldAddValue;
                if(val.finItemList&&val.finItemList.length>0){
                    let tempArr=[];
                    val.finItemList.forEach((item,index)=>{
                        let obj={
                            extrasProjectAmt:item.financeItemAmt,
                            extrasProjectName:item.financeItemName
                        }
                        tempArr.push(obj)
                    })
                    this.additionalLoanForm.additionalAmtList=tempArr;
                }
            }
        }
    },
    creatd(){

    },
    mounted(){
     
    },
    methods:{

    }
}
</script>
<style scoped>
.oldValue{
    display:inline-block;
    margin-left: 10px;
}
.commonSpan{
    position: absolute;
    margin-left: -16px;
}
</style>